<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>护士排班表列表</title>
	<#include "/common/resource.ftl">
    <link rel="stylesheet" href="${params.contextPath}/static/plug/layui/css/layui.css">
    <link href="${params.contextPath}/static/plug/fullcalendar/fullcalendar.min.css" rel="stylesheet" />
    <style>
        body {
            margin: 40px 10px;
            padding: 0;
            ont-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
            ont-size: 14px;
        }
        #calendar {
            max-width: 900px;
            margin: 0 auto;
        }
        .layui-form select {display:none !important;}
        tr:first-child > td > .fc-day-grid-event{
            padding:5px;
        }
        .closeon {background:#FF5722;padding:3px;border-radius:50%;width:10px;text-align:center;margin-right:5px;}
    </style>
</head>
<body>
<div id='calendar'></div>
</body>
<script src="${params.contextPath}/static/plug/layui/layui.all.js"></script>
<script src="${params.contextPath}/static/plug/fullcalendar/lib/jquery.min.js"></script>
<script src="${params.contextPath}/static/plug/fullcalendar/lib/moment.min.js"></script>
<script src="${params.contextPath}/static/plug/fullcalendar/lib/jquery-ui.min.js"></script>
<script src="${params.contextPath}/static/plug/fullcalendar/fullcalendar.min.js"></script>
<script src="${params.contextPath}/static/plug/fullcalendar/locale-all.js"></script>
<script>
    $(document).ready(function() {
        $('#calendar').fullCalendar({
            header: {
                left: 'prev,next,today',
                center: 'title',
                right: 'month,basicWeek,agendaDay,listMonth'
            },
            editable: true,
            eventLimit: true,
            navLinks: true,
            locale: 'zh-cn',
            businessHours: false,
            events: function(start, end, timezone, callback){
                // alert("start:" + start + ", end: " + end + ", timezone: " + timezone + ", callback: " + callback)
                var s = $.fullCalendar.formatDate(start, "YYYY-MM-DD HH:mm:ss");
                var e = $.fullCalendar.formatDate(end, "YYYY-MM-DD HH:mm:ss");
                // 查询时间段内的护士排班记录列表
                $.ajax({
                    type: "post",
                    dataType: "json",
                    url: '${params.contextPath}/web/nurseSchedule/listByTime.json',
                    data: {start: s, end: e},
                    success: function (data) {
                        var record = data.data;
                        console.log(record);
                        var events = [];
                        $.each(record,function(i,c) {
                            events.push({
                                id: c.id,
                                title: "<span class='closeon fa fa-close'></span>姓名: " + c.username + "(" + c.floor + "楼)",
                                start: c.scheduleDateStr , // will be parsed
                                color: '#000',
                                backgroundColor: '#009688',
                                borderColor: '#FFF'
                            });
                        });
                        callback(events);
                    }
                });
            },
            dayClick: function(date, allDay, jsEvent, view) {
                var url = "${params.contextPath}/view/business/nurseSchedule/nurseSchedule_edit.htm?scheduleDate=" + date;
                DialogManager.openDialog("url:'" + url + "',title:'编辑护士排班记录',width:'600px',height:'600px'");
                $('#calendar').fullCalendar('refetchEvents');
            },
            eventClick: function(event) {
                var url = "${params.contextPath}/view/business/nurseSchedule/nurseSchedule_edit.htm?id=" + event.id;
                DialogManager.openDialog("url:'" + url + "',title:'编辑护士排班记录',width:'600px',height:'600px'");
                $('#calendar').fullCalendar('refetchEvents');
            },
            eventRender: function (event, element) {
                element.html(event.title);
                element.find(".closeon").click(function() {
                    var id = event.id;
                    if (id == "") {
                        layer.msg("请选择删除记录");
                        return false;
                    }
                    if (!confirm("确定删除该记录吗？")) {
                        return false;
                    }
                    var url = "${params.contextPath}/web/nurseSchedule/delete.json";
                    $.ajax({
                        type: 'post',
                        url: url,
                        data: {ids: id},
                        success: function (data) {
                           $('#calendar').fullCalendar('refetchEvents');
                        }
                    });
                    $('#calendar').fullCalendar('removeEvents',event._id);
                });
            }
        });
    });
    window.onpageshow = function (event) {
        if (event.persisted || (window.performance && window.performance.navigation.type == 2)) {
            window.location.reload()
        }
    }
</script>
</html>
